const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const VueLoaderPlugin = require('vue-loader/lib/plugin');
const transformVwLoader = path.join(__dirname, './loaders/trans-vw-loader.js');
const createPage = () => {
    const publicPath = './src/'
    const pagePath = [
        'home',
        'about',
        'user'
    ]
    const plugins = pagePath.map((path) => {
        return new HtmlWebpackPlugin({
            // 输出的文件路径+文件名称 （文件路径可以不用设置）
            filename: path + '.html',
            // 只引入自身需要的js模块,index作为全局js 所有html都需要引入
            chunks: [path, 'index'],
            // 模板
            template: publicPath + path + '/index.html'
        })
    });

    // 每个单页项目的入口文件默认为index.ts
    const entrys = {};
    pagePath.map((path) => {
        entrys[path] = publicPath + path + '/index.ts';
    })
    return { plugins, entrys }
}
const page = createPage();
console.log(page);
module.exports = {
    devServer: {
        open: ['home.html'],
        port: 8080,
        hot: 'only',
        static: {
            directory: path.join(__dirname, 'dist'),
        },
        client: {
            // progress会在控制台输出
            progress: false
        },
        devMiddleware: {
            publicPath: "/",
        },
    },
    entry: {
        'index': './src/index.ts',
        ...page.entrys,
    },
    output: {
        path: path.join(__dirname, 'dist'),
        filename: '[name].[contenthash].bundle.js'
    },
    module: {
        rules: [
            {
                test: /\.vue$/,
                use: 'vue-loader'
            },
            {
                test: /\.less$/,
                include: [
                    /src/
                ],
                use: [
                    'style-loader',
                    'css-loader',
                    'less-loader',
                    {
                        loader: transformVwLoader,
                        options: {
                            // 标记需要转换的less头
                            transformHeader: '//@@transformVw',
                            // 设计稿宽度
                            layoutWidth: 750,
                            dpr: 2,
                            // 保留小数位数
                            decimal: 6
                        }
                    }
                ]
            }
        ]
    },
    plugins: [
        ...page.plugins,
        new VueLoaderPlugin()
    ],
    mode: 'development'
}